<template>
	<div class="col-sm-12" style="padding-bottom: 50px;">
	   	<router-link v-for=" item in lifesJson" :key="item.lifeId" class="col-sm-4 col-xs-12 life-list list-life" :to="item.url">
	    	<div class="col-sm-3 col-xs-4 ll-img">
	     		<img :src="item.lifeUrl" class="col-sm-12 col-xs-12" />
		    </div> 
		    <div class="col-sm-9 col-xs-8">
		     	<p style="height: 27px;overflow:  hidden;">{{item.lifeTitle}}</p> 
		     	<p>{{item.updateDate}}</p>
		    </div>
	   	</router-link>
  	</div>
</template>

<script>
	export default{
		props : {
			lifesJson : {
				type : Array,
				required : true
			}
		},
		mounted ($route) {
	 		this.$nextTick(()=>{
	 		})
	 	},
	}
</script>

<style>
	.life-list{
	    overflow: hidden;
	    border: 1px solid #e7e7e7;
	    padding: 10px;
	    color: #333;
	    background: #fff;
	}
	.list-life{
	    border-right: 0px;
	    border-left: 1px solid rgb(204, 204, 204);
	    border-top: 1px solid rgb(204, 204, 204);
	    border-bottom: 0px;	
	}
	.list-life .ll-img {
	    padding: 10px;
	    border: 1px solid #dfdfdf;
	    margin-top: 10px;
	    height: 83px;
	}
	.list-life .ll-img img{
		padding: 0px;
	}
</style>